<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<link rel="stylesheet" href="../css/simple.css" />
<title>关于闭包中的this</title>
</head>
<body>
  <div class="box">
    <h2>私有变量</h2>
    <p class="fz16">
      javascript中没有私有成员的概念；所有对象的属性都是公有的。<br />
      私有变量：函数中定义的变量，被认为是私有变量，因为函数外部不能访问这些变量。包括（参数，局部变量，函数内部定义的其他函数）
    </p>
    <pre>
      function add(num1,num2){ 
        var sum = num1 + num2;
        return sum;
      }

      三个私有变量：num1，num2,sum,在函数外部不能访问。
    </pre><br />
    <br />
    <br />
    <p class="fz16">在函数内部创建一个闭包，那么闭包可以通过自己的作用域链可以访问这些变量</p>
    <button onclick='prerogativeFunc_01()'>特权方法1</button><br /><br /><br />
    <button onclick='prerogativeFunc_02()'>特权方法2</button>
    <p class="fz14">变量privateVariable和函数privateFunction(),只能通过特权方法publicMethod()来访问</p>
    <script type="text/javascript">
      /*
      function MyObject(){ 
        this.privateVariable = 10;
        this.privateFunction = function(){
          return false;
        }
        this.publicMethod = function(){
          this.privateVariable ++;
          alert(this.privateVariable);
          return this.privateFunction();
        }
      }
      */
      function MyObject(){ 
        var privateVariable = 10;
        function privateFunction(){
          return false;
        }

        this.publicMethod = function(){
          privateVariable ++;
          alert(privateVariable);
          return privateFunction();
        }
      }

      var myOtherObject = new MyObject();
      var myAntherObject = new MyObject();

      function prerogativeFunc_01(){
        //console.log(myOtherObject);
        myOtherObject.publicMethod();
      }
      

      function prerogativeFunc_02(){
        console.log( myAntherObject );
        myAntherObject.publicMethod();
      }
    </script>
    <br /><br />
    <p class="fz18">没有理解下面</p>
    <pre>
      /*
      function MyObject(){ 
        this.privateVariable = 10;
        this.privateFunction = function(){
          return false;
        }
        this.publicMethod = function(){
          this.privateVariable ++;
          alert(this.privateVariable);
          return this.privateFunction();
        }
      }
      */
      function MyObject(){ 
        var privateVariable = 10;
        function privateFunction(){
          return false;
        }

        this.publicMethod = function(){
          privateVariable ++;
          alert(privateVariable);
          return privateFunction();
        }
      }

      var myOtherObject = new MyObject();

      var myAntherObject = new MyObject();

      function prerogativeFunc_01(){
        //console.log(myOtherObject);  //  个人理解
        myOtherObject.publicMethod();  //  根据闭包的作用域链，逐级向上查找
      }
      

      function prerogativeFunc_02(){
        console.log( myAntherObject );  //  个人理解
        myAntherObject.publicMethod();  //  根据闭包的作用域链，逐级向上查找
      }
    </pre>
    <br />
    <br />
    <br />
    <p class="fz16">利用私有和特权成员，可以隐藏那些不应该被直接修改的数据。</p>
    <button onclick="setOrGetName()">闭包2</button>
    <script type="text/javascript">
      function Person( name ){ 
        // name = name;
        this.getName = function(){ return name };
        this.setName = function( value ){ name = value }
      }

      var personOne = new Person('nicholas');

      function setOrGetName(){
        alert(personOne.getName());
        personOne.setName('Greg');
        alert(personOne.getName());
      }
    </script>
    

    <p class="fz24 fwb">静态私有变量，块级模式，增强块级模式（不懂 p209）</p>
    <p>通过私有作用域定义私有变量和函数</p>
    <pre>
      (function(){
        var name = "";
        Person = function(value){    //这个构造函数在全局中能找到
          name = value;
        };
        Person.prototype.getName = function(){
          return name;
        };
        Person.prototype.setName = function(value){ 
          name = value;
        }
      })();
      /*(function(){
        var person1 = new Person("nicholas");
        alert(person1.getName());
        person1.setName('Grag');
        alert( person1.getName() );
      })();*/
    </pre>
    <script type="text/javascript">
      (function(){
        var name = "";
        Person = function(value){    //这个构造函数在全局中能找到
          name = value;
        };
        Person.prototype.getName = function(){
          return name;
        };
        Person.prototype.setName = function(value){ 
          name = value;
        }
      })();
      /*(function(){
        var person1 = new Person("nicholas");
        alert(person1.getName());
        person1.setName('Grag');
        alert( person1.getName() );
      })();*/
      
    </script>

  </div>
</body>
</html>
